<template>
  <van-grid :border="false" :column-num="3">
    <van-grid-item  v-for="(item,index) in list" :key="index" @click="handleClick(item)">
        <p class="card-number"> {{item.value > 999 ? 999 + '+' : item.value }} </p>
        <span class="card-title">{{ item.title }}</span>
    </van-grid-item>
  </van-grid>
</template>
<script>
export default {
  props: {
    list: {
      type: Array,
      required: true
    }
  },
  methods: {
    handleClick(e) {
      this.$emit('cardclick',e)
    }
  }
}
</script>
<style lang="less" scoped>
.card {
  &-title {
    font-size: @global-font-size-desc;
    color: @font-color
  }
  &-number {
    font-size: 30px;
    font-weight: @global-font-weight-bold-zh;
  }
}
</style>